<template>
	<u-popup :show="showProtocol" :zIndex="10076" mode="bottom" :closeOnClickOverlay="false" :round="10">
		<view class="pop-box">
			<view class="title">溫馨提示</view>
			<view class="content">
				尊敬的用户，感謝您的支持與關注，我們深知個人信息對您的重要性，我們將按相關法律法規要求，盡力保護您的個人信息安全可控。在使用小程序服務前，請您仔細閲讀並充分理解《栢圖進修用户隱私使用協議》及《栢圖進修用户服務協議》，如您不同意以上政策的，很遺憾我們將無法繼續為您提供服務。
			</view>
			<view class="privacy-title" @click="$navigator('/pages/protocol?tags=PrivacyPolicyKey')">《用户服務協議》</view>
			<view class="privacy-title" @click="$navigator('/pages/protocol?tags=PrivacyPolicyKey')">《用户隱私使用協議》</view>
			<view class="button-box">
				<view class="disagree-btn" @click="onClose">
					不同意並退出
				</view>
				<view class="agree">
					<button v-if="hasPrivacySetting" id="agree-btn" open-type="agreePrivacyAuthorization" @click="handleWxAgree">
						同意
					</button>
					<button wx:else @click="handleAgree">
						同意
					</button>
				</view>
			</view>
		</view>
	</u-popup>
</template>

<script>
	export default {
		name: "ProtocolPop",
		options: {
			multipleSlots: true
		},
		data() {
			return {
				showProtocol: false,
				hasPrivacySetting: false
			}
		},
		async mounted() {
			const agreeAgreement = uni.getStorageSync('agreeAgreement') || false
			const systemInfo = await wx.getSystemInfo()
			this.hasPrivacySetting = this.compareVersion(systemInfo.SDKVersion, '2.32.3') >= 0
			if (this.compareVersion(systemInfo.SDKVersion, '2.32.3') >= 0) {
				wx.getPrivacySetting({
					success: res => {
						this.showProtocol = res.needAuthorization || !agreeAgreement
					}
				})
			} else {
				this.showProtocol = !agreeAgreement
			}
		},
		methods: {
			onClose() {
				wx.exitMiniProgram()
			},
			handleWxAgree(e) {
				this.showProtocol = false
				uni.setStorageSync('agreeAgreement', true)
				setTimeout(() => {
					this.$emit('authEvent', true)
				}, 500)
			},
			handleAgree() {
				this.showProtocol = false
				uni.setStorageSync('agreeAgreement', true)
			},
			// 比较版本号
			compareVersion(v1, v2) {
				v1 = v1.split('.')
				v2 = v2.split('.')
				const len = Math.max(v1.length, v2.length)
				while (v1.length < len) {
					v1.push('0')
				}
				while (v2.length < len) {
					v2.push('0')
				}
				for (let i = 0; i < len; i++) {
					const num1 = parseInt(v1[i])
					const num2 = parseInt(v2[i])
					if (num1 > num2) {
						return 1
					} else if (num1 < num2) {
						return -1
					}
				}
				return 0
			}
		}
	}
</script>

<style lang="scss" scoped>
	.pop-box {
	  padding: 60rpx 40rpx 40rpx;
	}
	.title {
	  font-size: 36rpx;
	  font-weight: bold;
	  color: #000000;
	  padding-bottom: 20rpx;
	}
	.content {
	  font-size: 28rpx;
	  font-weight: 400;
	  color: #414141;
	  margin-bottom: 100rpx;
	}
	.privacy-title {
	  font-size: 28rpx;
	  font-weight: 400;
	  color: #E9930A;
	}
	.button-box {
	  display: flex;
	  align-items: center;
	  margin-top: 82rpx;
	  justify-content: space-around;
	}
	.agree button {
	  width: 330rpx;
	  height: 90rpx;
	  background: #E9930A;
	  border-radius: 49rpx;
	  font-size: 32rpx;
	  font-weight: 400;
	  color: #FFFFFF;
	  text-align: center;
	  line-height: 90rpx;
	}
	.disagree-btn {
	  width: 320rpx;
	  height: 90rpx;
	  background: #FFFFFF;
	  border-radius: 49rpx;
	  border: 1px solid #B2B2B2;
	  font-size: 32rpx;
	  font-weight: 400;
	  color: #9F9F9F;
	  text-align: center;
	  line-height: 90rpx;
	}
</style>